<template>
	<van-popup v-model="visible" closeable @close="close">
		<div class="title">
			{{ title }}
		</div>
		<slot></slot>
	</van-popup>
</template>

<script>
import { Popup } from 'vant'
export default {
	components: {
		'van-popup': Popup
	},
	data() {
		return {
			visible: false
		};
	},
	props: {
		title: [String]
	},
	methods: {
		open() {
			this.visible = true;
		},
		close() {
			this.visible = false;
			this.$emit('close');
		}
	}
};
</script>
<style lang="scss" scoped>
.van-popup {
	width: 600px;
	border-radius: 16px;
	padding: 0 30px 40px 30px;
	.title {
		font-size: 30px;
		margin-top: 40px;
		text-align: center;
		margin-bottom: 60px;
		font-weight: 600;
		color: #383434;
		position: relative;
	}
}
</style>
